<template>
  <div class="person-view">
    <ImageView :src="imageUrl" class="avatar" />
    <div class="name">{{ name }}</div>
  </div>
</template>

<script setup lang="ts">


import ImageView from '@/views/jiraCompontent/ImageView.vue'

defineProps<{
  imageUrl: string
  name: string
}>()
</script>

<style scoped>
.person-view {
  display: flex;
  flex-flow: row;
  gap: 3px;
  align-items: center;
  background-color: var(--el-fill-color);
  border-radius: 12px;
  padding: 0 5px 0 0;
  height: 19px;
}

.avatar {
  width: 18px;
  height: 18px;
  border-radius: 10px;
  border: 1px solid var(--el-color-white);
}

.name {
  color: var(--dh-text-regular);
  font-size: 13px;
  line-height: 17px;
  font-weight: 500;
}
</style>
